import { VxeTable, VxeColumn, VxeColgroup, VxeGrid, VxeToolbar, VxeUI } from 'vxe-table'
import { VxeTooltip, VxeLoading } from 'vxe-pc-ui'
import zhCN from 'vxe-table/es/locale/lang/zh-CN'
import 'vxe-table/styles/cssvar.scss'
import XEUtils from 'xe-utils'

VxeUI.setConfig({
  i18n: (key, args) => XEUtils.toFormatString(XEUtils.get(zhCN, key), args),
})
VxeUI.interceptor.add('event.keydown', {
  tableInterceptorMethod(params) {
    console.log('tableInterceptorMethod', params)
    const { $event, $table } = params
    // 检测F2键或Enter键被按下，将当前单元格设置为编辑状态
    if ($event.key === 'F2' || $event.key === 'Enter') {
      // 获取当前活动的单元格
      const activeCell = $table.getSelectedCell()
      if (activeCell) {
        const { row, column } = activeCell
        // 检查列是否可编辑
        if (column && column.editRender) {
          // 设置单元格为编辑状态
          $table.setEditCell(row, column)
          /*setTimeout(() => {
            const cellElement = $table.getCellElement(row, column)
            cellElement.querySelector('.ep-form-item__label')?.focus()
          })*/
          // 阻止默认行为
          $event.preventDefault()
          return false
        }
      }
    }
    return true
  },
})

export const useVXE = (app) => {
  //ui
  app.use(VxeLoading)
  app.use(VxeTooltip)
  //表格
  app.use(VxeTable)
  app.use(VxeColumn)
  app.use(VxeColgroup)
  app.use(VxeGrid)
  app.use(VxeToolbar)
}
